<template>
  <div id="app" data-bs-theme="theme-dark">
    <div class="top-bar" v-if="showBar">
      <!-- v-if="showBar"-->
      <div class="left">
        <img src="../assets/logo.png" height="100%" />
        <span>爱生活-爱工作</span>
      </div>
      <div class="right">
        <span class="fa fa-thumb-tack" @click="openMini"></span>
        <span class="fa fa-window-minimize" @click="onMinimize"></span>
        <span class="fa" :class="maxRes" @click="onMaximize"></span>
        <span class="fa fa-close" @click="onClose"></span>
      </div>
    </div>
    <div class="view">
      <router-view />
    </div>
    <div v-if="showUpdateModal"
      style="width: 100%;height: 100%;position: fixed;z-index: 999999999;background: rgba(0,0,0,0.7);">
      <div
        style="display: flex;flex-direction: column;box-sizing: border-box;padding: 14px;box-shadow: 0 0 6px #5a5a5a;border-radius: 4px;width: 500px;height: 400px;background: #FFFFFF;top: calc(50% - 200px);left: calc(50% - 250px);position: relative;">
        <div style="font-size: 1.2rem;font-weight: bold;text-align: center;">
          发现新版本:{{ serverVersion.version }}
        </div>
        <div style="margin: 10px 0;color: #34495e;flex: 1;overflow: auto;">
          更新信息：<br />
          <div v-html="serverVersion.updateInfo"></div>
        </div>
        <div style="margin: 10px 0;color: #34495e;display: inline;text-align: right;">
          <div
            style="display: inline-block;padding: 6px 20px;border-radius: 4px;background: #2980b9;color: #FFFFFF;cursor: pointer;"
            @click="toDownload">
            前往下载
          </div>
          <!-- <div style="display: inline-block;padding: 6px 20px;border-radius: 4px;background: #f1c40f;color: #FFFFFF;cursor: pointer;"
            @click="ignoreThisVersion">不再提示该版本</div> -->
          <div
            style="display: inline-block;padding: 6px 20px;border-radius: 4px;background: #95a5a6;color: #FFFFFF;cursor: pointer;"
            @click="ignore">
            下次一定
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
var ipcRenderer;
import { globalBus } from "@/assets/js/globalBus.js";

if (window.require) {
  ipcRenderer = window.require("electron").ipcRenderer;
}
export default {
  name: "App",
  data() {
    return {
      showUpdateModal: false,
      maxRes: "fa-solid fa-expand",
      showBar: false,
      updateUrl: "",
      localVersion: "",
      serverVersion: ""
    };
  },
  provide() {
    return {
      reload: this.reload
    };
  },
  mounted() {
    // document.body.className = 'theme-' + this.$store.state.theme.themeType
    document.body.className = 'theme-dark'
    var _this = this;
    if (ipcRenderer) {
      this.showBar = true;

      //监听窗口变化
      ipcRenderer.on("restoreMaximize", (event, data) => {
        switch (data) {
          case "restore":
            _this.maxRes = "fa-solid fa-expand";
            break;
          case "maximize":
            _this.maxRes = "fa-solid fa-compress";
            break;
        }
      });

      ipcRenderer.send("get-app-info");
      ipcRenderer.on("get-app-info-back", (event, data) => {
        _this.localVersion = data;
        this.update();
      });

      //监听窗口变化
      ipcRenderer.on("message", (event, data) => {
        if (data.type == "version") {
          _this.serverVersion = JSON.parse(data.data);
          this.update();
        }
      });
      this.getVersionList();
    } else {
      //浏览器测试内容
      _this.serverVersion = {
        name: "AWork",
        productName: "AWork",
        author: "hzl",
        version: "0.1.1",
        main: "main.js",
        updateTime: "2021/03/08",
        description: "爱工作",
        updateInfo: "新增erm 模块",
        webApps: []
      };
      this.update();
    }
  },

  methods: {
    getVersionList() {
      var _this = this;
      var data = null;
      var xhr = new XMLHttpRequest();
      xhr.withCredentials = true;
      xhr.addEventListener("readystatechange", function () {
        if (this.readyState === 4) {
          var res = JSON.parse(this.responseText);
          var attach_files = res.release.release.attach_files;
          for (var x in attach_files) {
            if (attach_files[x].name == "package.json") {
              _this.updateUrl = attach_files[x].download_url;
              ipcRenderer.send("http-get", {
                type: "version",
                url: "https://gitee.com/" + _this.updateUrl
              });
              return;
            }
          }
        }
      });
      xhr.open("GET", "https://gitee.com/conesat/awork/releases/version");
      xhr.setRequestHeader("cache-control", "no-cache");
      xhr.setRequestHeader(
        "Postman-Token",
        "8fe4c8ad-42d5-48ce-b8d7-f6e60f31f62a"
      );
      xhr.send(data);
    },
    ignore() {
      this.showUpdateModal = false;
    },
    toDownload() {
      this.showUpdateModal = false;
      ipcRenderer.send("open-url", this.serverVersion.doenloadUrl);
    },
    ignoreThisVersion() {
      localStorage.setItem("ignoreVerson", this.serverVersion.version);
      this.showUpdateModal = false;
    },
    update() {
      if (this.serverVersion && this.localVersion) {
        let v1 = 0;
        let v2 = 0;
        let vs1 = this.localVersion.version.split(".");
        let vs2 = this.serverVersion.version.split(".");
        for (let i = 0; i < vs1.length; i++) {
          v1 += parseInt(vs1[i]) * 10 ** (vs1.length - 1 - i);
        }
        for (let i = 0; i < vs2.length; i++) {
          v2 += parseInt(vs2[i]) * 10 ** (vs2.length - 1 - i);
        }
        if (
          v2 > v1 &&
          localStorage.getItem("ignoreVerson") != this.serverVersion.version
        ) {
          this.showUpdateModal = true;
        }
      }

      if (this.serverVersion) {
        globalBus.$emit("loadWebApps", this.serverVersion.webApps);
      }
    },
    openMini() {
      ipcRenderer.send("open-tool-win");
    },
    //置顶功能
    onTopping() {
      ipcRenderer.send("window-top");
    },
    //最小化
    onMinimize() {
      ipcRenderer.send("window-min");
    },
    //最大化
    onMaximize() {
      ipcRenderer.send("window-max");
    },
    //关闭
    onClose() {
      ipcRenderer.send("window-close");
    }
  }
};
</script>

<style lang="less">
.theme-dark {
  background: #191919;

  .form-control {
    background: transparent;
  }

  .top-bar {
    z-index: 99999999;
    background: #000;
    color: #fff;

    .right {
      span:hover {
        background: rgb(68, 68, 68);
      }
    }
  }
}

.theme-light {
  background: #000;

  .top-bar {
    background: #000;
    color: #546e7a;

    .right {
      span:hover {
        background: #dadada;
      }
    }
  }
}

#app {
  display: flex;
  flex-direction: column;

  .top-bar {
    display: flex;
    height: 2rem;
    line-height: 2rem;
    font-size: 0.8rem;

    .left {
      display: flex;
      margin-left: 10px;
      flex: 1;
      -webkit-app-region: drag;
      -webkit-user-select: none;
    }

    .right {
      display: flex;

      span {
        padding: 0 16px;
        line-height: 2rem;
      }

    }
  }

  .view {
    flex: 1;
    height: 100px;
  }
}
</style>
